<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta name="generator" content=
  "HTML Tidy for HTML5 for Linux version 5.6.0" />
  <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name=
  "viewport" />
  <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
  <script type='text/javascript' src=
  'https://s3.amazonaws.com/mturk-public/externalHIT_v1.js'></script><!-- BOOTSTRAP CSS -->
  <link crossorigin="anonymous" href=
  "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
  integrity=
  "sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
  rel="stylesheet" /><!-- HITPUB CSS -->
  <link href=
  "https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700,700i" rel=
  "stylesheet" />
  <style id="hitpub_css" type="text/css">
  /*<![CDATA[*/
  /***********************************************
                        MOSAIC BOOSTRAP OVERWRITES
                        ***********************************************/
                        #hitinfo .card {
                            border-radius: 0;
                        }
                        #hitinfo .card:first-child {
                            border-bottom: 0;
                        }
                         #hitinfo button.btn-link {
                            color: #06486F;
                            text-decoration: none;
                         }
                        #hitinfo button.btn-link:hover {
                            text-decoration: none;
                        }
                        #hit ul.question-choice {
                            list-style-type: none;
                        }
                        /***********************************************
                        MOSAIC GENERAL STYLING
                        ***********************************************/
                         body {
                             font-family: "Open Sans", "Roboto", sans-serif;
                         }
                        textarea#feedback {
                            width: 100%
                        }
                        input#submitButton {
                            margin: auto;
                            display: block;
                            background-color: #2172a4;
                            color: #fff;
                            font-size: 1.125rem;
                            padding: .5rem 1rem;
                            cursor: pointer;
                            border-radius: 1rem;
                        }
                        input#submitButton:hover {
                            background-color: #06486F;
                        }
  /*]]>*/
  </style>
  <title></title>
  <style type="text/css">
  /*<![CDATA[*/
  small.c14 {min-height:70px;}
  label.c13 {color:green;}
  label.c12 {color:red;}
  label.c11 {font-size: 32px}
  strong.c10 {color:red}
  strong.c9 {color:mediumseagreen}
  fieldset.c8 {border: 1px solid #D55E00; margin: 20px; padding: 0 10px 10px; border-radius: 8px; padding-top: 10px; box-shadow: 0 0 3px #666;}
  fieldset.c7 {border: 1px solid #0072B2; margin: 20px; padding: 0 10px 10px; border-radius: 8px; padding-top: 10px; box-shadow: 0 0 3px #666;}
  strong.c6 {color:red;}
  strong.c5 {color:green;}
  span.c4 {color:green;}
  span.c3 {color:red;}
  em.c2 {text-decoration: underline}
  span.c1 {text-decoration: underline}
  /*]]>*/
  </style>
</head>
<body>
  <div class="container" id="hit">
    <div class="col-8 offset-2 accordion" id="hitinfo">
      <!-- INSTRUCTIONS START -->
      <div class="card">
        <div class="card-header" id="instructionsHeading">
          <h5 class="mb-0"><button aria-controls="instructions" aria-expanded=
          "true" class="btn btn-link" data-target="#instructions" data-toggle=
          "collapse" type="button">Instructions (click to expand)</button></h5>
        </div>
        <div aria-labelledby="instructionsHeading" class="collapse card-body"
        data-parent="#hitinfo" id="instructions">
          <p>In this HIT you will be presented with a <span class=
          "key-term1">partial movie review</span> that acts as a prompt and a
          <span class="key-term2">system's automatically-generated
          continuation</span> of that excerpt. Your job is to rate the the
          <span class="key-term2">system generation</span> across 2 axes:</p>
          <ul>
            <li><strong>Coherence/Quality:</strong> <em>Is the system's
            generation <span class="c1">grammatical, easy-to-read</span> and
            does it <span class="c1">follow from the prompt?</span></em></li>
            <li><strong>Sentiment:</strong> <em class="c2">Just considering the
            completion, how positive is it?</em></li>
          </ul>
          <p>You will be able to rate each of the three axes on a scale from 1
          to 5, with <span class="c3">1 being the lowest/worst</span> and
          <span class="c4">5 the highest/best</span>. The specific scales
          are:</p>
          <ul>
            <li>
              <strong>Coherence/Quality:</strong>
              <ul>
                <li><strong class="c5">5/5 (excellent):</strong> The completion
                follows effortlessly from the prompt, and is grammatical,
                fluent, and reasonable.</li>
                <li>4/5 (good): The completion makes sense given the input, but
                there are minor grammatical errors or topical shifts that don't
                make for the best writing.</li>
                <li>3/5 (okay): I can see why this continued from the input,
                and it's readable, but there are problems that can't be
                ignored.</li>
                <li>2/5 (poor): Some parts of the completion might make sense
                given the input, but it's unnatural, illogical, or quite hard
                to read.</li>
                <li><strong class="c6">1/5 (terrible):</strong> The completion
                completely ignores or contradicts the input, and/or there are
                severe errors in grammaticality or fluency.</li>
              </ul>
            </li>
          </ul>
          <ul>
            <li>
              <strong>Sentiment</strong>
              <ul>
                <li><strong class="c5">5/5 (very positive):</strong> The
                completion is glowingly positive.</li>
                <li>4/5 (mostly positive): The completion is mostly positive,
                but there are some imperfections mentioned.</li>
                <li>3/5 (neutral): The completion either doesn't represent a
                positive/negative opinion, or it contains both very positive
                and very negative aspects.</li>
                <li>2/5 (mostly negative): Most of what's expressed here is
                very negative.</li>
                <li><strong class="c6">1/5 (scathingly negative):</strong> The
                completion offers a strongly negative opinion.</li>
              </ul>
            </li>
          </ul><br />
          <em>Note: for rating sentiment, only consider the completion, and not
          the prompt itself!</em>
        </div>
      </div><!-- INSTRUCTIONS END --><!-- EXAMPLES START -->
      <div class="card">
        <div class="card-header" id="examplesHeading">
          <h5 class="mb-0"><button aria-controls="examples" aria-expanded=
          "true" class="btn btn-link" data-target="#examples" data-toggle=
          "collapse" type="button">Examples (click to expand)</button></h5>
        </div>
        <div aria-labelledby="examplesHeading" class="collapse card-body"
        data-parent="#hitinfo" id="examples">
          <h3>Example 1:</h3>
          <div class="row col-12">
            <h5><span class="key-term1">Prompt:</span></h5>
            <div class="col-12 align-text-center">
              <fieldset class="c7">
                I cannot BELIEVE anyone is giving this film a good rating. In
                addition to the terrible acting, thin (nonexistent?) plot line
                and slooooooooow pace, this would be the movie to watch if you
                were really TRYING to fall asleep. The writer's and director's
                brains must have been fried eggs to ever have concocted
                something as abominable as this. Based on the
              </fieldset>
            </div>
          </div>
          <div class="row col-12">
            <h5><span class="key-term2">System's generation <span class=
            "c1">(rate this!)</span>:</span></h5>
            <div class="col-12 align-text-center">
              <fieldset class="c8">
                ... director's prior work, however, I have hope for her future
                films. I think this small misstep is the result of a producer
                hampering her excellent creativity. There are some shining
                moments that show her expertise, and I look forward to the
                director's future films!
              </fieldset>
            </div>
          </div>&nbsp;
          <ul>
            <li><strong class="c9">Coherence/Quality: 4/5</strong>
            <em>Why?</em> The completion recognizes that this movie isn't good
            (as described in the prompt), and makes a reasonable pivot towards
            talking about the director's other works. The shift in sentiment is
            somewhat abrupt, but is well-explained.</li>
            <li><strong class="c9">Sentiment: 4/5</strong> <em>Why?</em> The
            completion recognizes some shortcomings as a pivot, but also,
            provides a hopeful message for the director's future work.</li>
          </ul>&nbsp;
          <h3>Example 2:</h3>
          <div class="row col-12">
            <h5><span class="key-term1">Prompt:</span></h5>
            <div class="col-12 align-text-center">
              <fieldset class="c7">
                I cannot BELIEVE anyone is giving this film a good rating. In
                addition to the terrible acting, thin (nonexistent?) plot line
                and slooooooooow pace, this would be the movie to watch if you
                were really TRYING to fall asleep. The writer's and director's
                brains must have been fried eggs to ever have concocted
                something as abominable as this. Based on the
              </fieldset>
            </div>
          </div>
          <div class="row col-12">
            <h5><span class="key-term2">System's generation <span class=
            "c1">(rate this!)</span>:</span></h5>
            <div class="col-12 align-text-center">
              <fieldset class="c8">
                ... amazing filmmaking, the film is a must-see for anyone who
                loves movies. A masterpiece of cinema, great for all ages. I
                highly recommend this film to anyone. 10/10.
              </fieldset>
            </div>
          </div>
          <ul>
            <li><strong class="c10">Coherence/Quality: 1/5</strong>
            <em>Why?</em> The very positive completion doesn't make any sense
            given the very negative discussion in the prompt. It contradicts
            the prompt entirely.</li>
            <li><strong class="c5">Sentiment: 5/5</strong> <em>Why?</em> The
            completion, in isolation, offers only very positive opinions.</li>
          </ul>&nbsp;
          <h3>Example 3:</h3>
          <div class="row col-12">
            <h5><span class="key-term1">Prompt:</span></h5>
            <div class="col-12 align-text-center">
              <fieldset class="c7">
                I cannot BELIEVE anyone is giving this film a good rating. In
                addition to the terrible acting, thin (nonexistent?) plot line
                and slooooooooow pace, this would be the movie to watch if you
                were really TRYING to fall asleep. The writer's and director's
                brains must have been fried eggs to ever have concocted
                something as abominable as this. Based on the
              </fieldset>
            </div>
          </div>
          <div class="row col-12">
            <h5><span class="key-term2">System's generation <span class=
            "c1">(rate this!)</span>:</span></h5>
            <div class="col-12 align-text-center">
              <fieldset class="c8">
                ... other reviews for this film, it seems I'm not alone. Most
                everyone agrees that this film is a total abomination. The
                sooner this film is forgotten, the better. A disgusting insult
                to cinema.
              </fieldset>
            </div>
          </div>
          <ul>
            <li><strong class="c5">Coherence/Quality: 5/5</strong>
            <em>Why?</em> This is a reasonable and grammatical continuation of
            the very negative review.</li>
            <li><strong class="c6">Sentiment: 1/5</strong> <em>Why?</em> This
            is a scathingly negative review.</li>
          </ul>
        </div>
      </div>
    </div><!-- MTURK INPUT START -->
    <div class="col-8 mt-5 offset-2 align-content-center">
      <form action="https://www.mturk.com/mturk/externalSubmit" id="mturk_form"
      method="post" name="mturk_form">
        <input id="assignmentId" name="assignmentId" type="hidden" value="" />
        <input id="ee" name="ee" type="hidden" />
        <div class="row col-12">
          <h5><span class="key-term1">Prompt (read me first!):</span></h5>
          <div class="col-12 align-text-center">
            <fieldset class="c7">
              ${prompt}...
            </fieldset>
          </div>
        </div>
        <div class="row col-12">
          <h5><span class="key-term2">System's generation <span class=
          "c1">(rate this!)</span>:</span></h5>
          <div class="col-12 align-text-center">
            <fieldset class="c8">
              ...${machine_completion}
            </fieldset>
          </div>
        </div>
        <div class=
        "row align-content-center mt-5 col-12 align-content-center form-group">
          <label for="coherence" id="coherencelabel" class=
          "c11"><strong>Coherence/Quality: 3/5</strong></label><br />
          <small>Is the system's generation <span class="c1">grammatical,
          easy-to-read</span> and does it <span class="c1">follow from the
          prompt?</span></small><br />
          <label class="float-left c12">Bad</label> <label class=
          "float-right c13">Excellent</label><br />
          <input class="form-control-range" id="coherence" list=
          "coherence_list" max="5" min="1" name="coherence" step="1" type=
          "range" value="3" /> <datalist id="coherence_list">
            <option label="bad" value="1">
            </option>
            <option label="mediocre" value="2">
            </option>
            <option label="okay" value="3">
            </option>
            <option label="good" value="4">
            </option>
            <option label="excellent" value="5">
            </option>
          </datalist> <small class="form-text text-muted c14" id=
          "coherenceHelp">I can see why this continued from the input, and it's
          readable, but there are problems that can't be ignored.</small>
        </div>
        <div class=
        "row align-content-center col-12 align-content-center form-group">
          <label for="sentiment" id="sentimentlabel" class=
          "c11"><strong>Sentiment: 3/5</strong></label><br />
          <small><em>Just considering the system's generation, how positive is
          it?</em></small><br />
          <label class="float-left c12">Very Negative</label> <label class=
          "float-right c13">Very Positive</label><br />
          <input class="form-control-range" id="sentiment" list=
          "sentiment_list" max="5" min="1" name="sentiment" step="1" type=
          "range" value="3" /> <datalist id="sentiment_list">
            <option label="bad" value="1">
            </option>
            <option label="mediocre" value="2">
            </option>
            <option label="okay" value="3">
            </option>
            <option label="good" value="4">
            </option>
            <option label="excellent" value="5">
            </option>
          </datalist> <small class="form-text text-muted c14" id=
          "sentimentHelp">The completion either doesn't represent a
          positive/negative opinion, or it contains both very positive and very
          negative aspects.</small>
        </div><!-- OPTIONAL FEEDBACK -->
        <div class="row mt-5 col-8 offset-2 col-lg-6 offset-lg-3">
          <p>(Optional) Please let us know if anything was unclear, if you
          experienced any issues, or if you have any other feedback for us.</p>
          <textarea id="feedback" name="feedback" rows="3"></textarea>
        </div><!-- SUBMIT BUTTON -->
        <div class="row mt-5 col-2 offset-5">
          <input id="submitButton" onclick="getnext()" type="submit" value=
          "Submit" />
        </div>
      </form>
      <script language='Javascript'>
      <![CDATA[
      turkSetAssignmentID();
      ]]>
      </script>
    </div><!-- MTURK INPUT END -->
  </div><!-- HIT END --><!-- BOOSTRAP JS -->
  <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity=
  "sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
  crossorigin="anonymous"></script> 
  <script src=
  "https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
  integrity=
  "sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
  crossorigin="anonymous"></script> 
  <script src=
  "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
  integrity=
  "sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
  crossorigin="anonymous"></script><!-- HITPUB JS -->
   
  <script id="hitpub_js">


  <![CDATA[

                        
                        // TimeMe.js
                        (function () { var e, t; e = this, t = function () { var r = { startStopTimes: {}, idleTimeoutMs: 3e4, currentIdleTimeMs: 0, checkStateRateMs: 250, active: !1, idle: !1, currentPageName: "default-page-name", timeElapsedCallbacks: [], userLeftCallbacks: [], userReturnCallbacks: [], trackTimeOnElement: function (e) { var t = document.getElementById(e); t && (t.addEventListener("mouseover", function () { r.startTimer(e) }), t.addEventListener("mousemove", function () { r.startTimer(e) }), t.addEventListener("mouseleave", function () { r.stopTimer(e) }), t.addEventListener("keypress", function () { r.startTimer(e) }), t.addEventListener("focus", function () { r.startTimer(e) })) }, getTimeOnElementInSeconds: function (e) { var t = r.getTimeOnPageInSeconds(e); return t || 0 }, startTimer: function (e, t) { if (e || (e = r.currentPageName), void 0 === r.startStopTimes[e]) r.startStopTimes[e] = []; else { var n = r.startStopTimes[e], i = n[n.length - 1]; if (void 0 !== i && void 0 === i.stopTime) return } r.startStopTimes[e].push({ startTime: t || new Date, stopTime: void 0 }), r.active = !0, r.idle = !1 }, stopAllTimers: function () { for (var e = Object.keys(r.startStopTimes), t = 0; t < e.length; t++)r.stopTimer(e[t]) }, stopTimer: function (e, t) { e || (e = r.currentPageName); var n = r.startStopTimes[e]; void 0 !== n && 0 !== n.length && (void 0 === n[n.length - 1].stopTime && (n[n.length - 1].stopTime = t || new Date), r.active = !1) }, getTimeOnCurrentPageInSeconds: function () { return r.getTimeOnPageInSeconds(r.currentPageName) }, getTimeOnPageInSeconds: function (e) { var t = r.getTimeOnPageInMilliseconds(e); return void 0 === t ? void 0 : t / 1e3 }, getTimeOnCurrentPageInMilliseconds: function () { return r.getTimeOnPageInMilliseconds(r.currentPageName) }, getTimeOnPageInMilliseconds: function (e) { var t = r.startStopTimes[e]; if (void 0 !== t) { for (var n = 0, i = 0; i < t.length; i++) { var s = t[i].startTime, o = t[i].stopTime; void 0 === o && (o = new Date), n += o - s } return Number(n) } }, getTimeOnAllPagesInSeconds: function () { for (var e = [], t = Object.keys(r.startStopTimes), n = 0; n < t.length; n++) { var i = t[n], s = r.getTimeOnPageInSeconds(i); e.push({ pageName: i, timeOnPage: s }) } return e }, setIdleDurationInSeconds: function (e) { var t = parseFloat(e); if (!1 !== isNaN(t)) throw { name: "InvalidDurationException", message: "An invalid duration time (" + e + ") was provided." }; return r.idleTimeoutMs = 1e3 * e, this }, setCurrentPageName: function (e) { return r.currentPageName = e, this }, resetRecordedPageTime: function (e) { delete r.startStopTimes[e] }, resetAllRecordedPageTimes: function () { for (var e = Object.keys(r.startStopTimes), t = 0; t < e.length; t++)r.resetRecordedPageTime(e[t]) }, resetIdleCountdown: function () { r.idle && r.triggerUserHasReturned(), r.idle = !1, r.currentIdleTimeMs = 0 }, callWhenUserLeaves: function (e, t) { this.userLeftCallbacks.push({ callback: e, numberOfTimesToInvoke: t }) }, callWhenUserReturns: function (e, t) { this.userReturnCallbacks.push({ callback: e, numberOfTimesToInvoke: t }) }, triggerUserHasReturned: function () { if (!r.active) for (var e = 0; e < this.userReturnCallbacks.length; e++) { var t = this.userReturnCallbacks[e], n = t.numberOfTimesToInvoke; (isNaN(n) || void 0 === n || 0 < n) && (t.numberOfTimesToInvoke -= 1, t.callback()) } r.startTimer() }, triggerUserHasLeftPage: function () { if (r.active) for (var e = 0; e < this.userLeftCallbacks.length; e++) { var t = this.userLeftCallbacks[e], n = t.numberOfTimesToInvoke; (isNaN(n) || void 0 === n || 0 < n) && (t.numberOfTimesToInvoke -= 1, t.callback()) } r.stopAllTimers() }, callAfterTimeElapsedInSeconds: function (e, t) { r.timeElapsedCallbacks.push({ timeInSeconds: e, callback: t, pending: !0 }) }, checkState: function () { for (var e = 0; e < r.timeElapsedCallbacks.length; e++)r.timeElapsedCallbacks[e].pending && r.getTimeOnCurrentPageInSeconds() > r.timeElapsedCallbacks[e].timeInSeconds && (r.timeElapsedCallbacks[e].callback(), r.timeElapsedCallbacks[e].pending = !1); !1 === r.idle && r.currentIdleTimeMs > r.idleTimeoutMs ? (r.idle = !0, r.triggerUserHasLeftPage()) : r.currentIdleTimeMs += r.checkStateRateMs }, visibilityChangeEventName: void 0, hiddenPropName: void 0, listenForVisibilityEvents: function () { void 0 !== document.hidden ? (r.hiddenPropName = "hidden", r.visibilityChangeEventName = "visibilitychange") : void 0 !== document.mozHidden ? (r.hiddenPropName = "mozHidden", r.visibilityChangeEventName = "mozvisibilitychange") : void 0 !== document.msHidden ? (r.hiddenPropName = "msHidden", r.visibilityChangeEventName = "msvisibilitychange") : void 0 !== document.webkitHidden && (r.hiddenPropName = "webkitHidden", r.visibilityChangeEventName = "webkitvisibilitychange"), document.addEventListener(r.visibilityChangeEventName, function () { document[r.hiddenPropName] ? r.triggerUserHasLeftPage() : r.triggerUserHasReturned() }, !1), window.addEventListener("blur", function () { r.triggerUserHasLeftPage() }), window.addEventListener("focus", function () { r.triggerUserHasReturned() }), document.addEventListener("mousemove", function () { r.resetIdleCountdown() }), document.addEventListener("keyup", function () { r.resetIdleCountdown() }), document.addEventListener("touchstart", function () { r.resetIdleCountdown() }), window.addEventListener("scroll", function () { r.resetIdleCountdown() }), setInterval(function () { r.checkState() }, r.checkStateRateMs) }, websocket: void 0, websocketHost: void 0, setUpWebsocket: function (e) { if (window.WebSocket && e) { var t = e.websocketHost; try { r.websocket = new WebSocket(t), window.onbeforeunload = function () { r.sendCurrentTime(e.appId) }, r.websocket.onopen = function () { r.sendInitWsRequest(e.appId) }, r.websocket.onerror = function (e) { console && console.log("Error occurred in websocket connection: " + e) }, r.websocket.onmessage = function (e) { console && console.log(e.data) } } catch (e) { console && console.error("Failed to connect to websocket host.  Error:" + e) } } return this }, websocketSend: function (e) { r.websocket.send(JSON.stringify(e)) }, sendCurrentTime: function (e) { var t = { type: "INSERT_TIME", appId: e, timeOnPageMs: r.getTimeOnCurrentPageInMilliseconds(), pageName: r.currentPageName }; r.websocketSend(t) }, sendInitWsRequest: function (e) { var t = { type: "INIT", appId: e }; r.websocketSend(t) }, initialize: function (e) { var t = r.idleTimeoutMs || 30, n = r.currentPageName || "default-page-name", i = void 0, s = void 0; e && (t = e.idleTimeoutInSeconds || t, n = e.currentPageName || n, i = e.websocketOptions, s = e.initialStartTime), r.setIdleDurationInSeconds(t).setCurrentPageName(n).setUpWebsocket(i).listenForVisibilityEvents(), r.startTimer(void 0, s) } }; return r }, "undefined" != typeof module && module.exports ? module.exports = t() : "function" == typeof define && define.amd ? define([], function () { return e.TimeMe = t() }) : e.TimeMe = t() }).call(this);
                        
                        TimeMe.initialize({
                            currentPageName: "task",
                            idleTimeoutInSeconds: 30
                        });
                        
                        
                        
                        $(document).ready(function() {
                            var cookie_name = '_task_imdb_RLUE_v1';
                            
                            $('.collapse').collapse({ 'toggle': false }).on('hidden.bs.collapse', function() {
                                if (this.id) {
                                    localStorage[this.id + cookie_name] = 'true';
                                }
                            }).on('shown.bs.collapse', function() {
                                if (this.id) {
                                    localStorage.removeItem(this.id + cookie_name);
                                }
                            }).each(function() {
                                if (this.id && localStorage[this.id + cookie_name] == 'true' ) {
                                    $(this).collapse('hide');
                                }
                            });
                        
                        
                            $('#submitButton').click(function () {
                                try {
                                    $('input[name=ee]').attr('value', TimeMe.getTimeOnCurrentPageInSeconds());
                                } catch {
                                }
                                return true;
                            });
                        
                            $('#coherence').on('input', function() {
                                var value = $(this).val()
                                if(value == 5) {
                                    $('#coherenceHelp').text(
                                        "The completion follows effortlessly from the prompt, and is grammatical, fluent, and reasonable.");
                                    $('#coherencelabel').html('<strong style="color:green;">Coherence/Quality: 5/5</strong>');
                                }
                                else if(value == 4) {
                                    $('#coherenceHelp').text("The completion makes sense given the input, but there are minor grammatical errors or topical shifts that don't make for the best writing.");
                                    $('#coherencelabel').html('<strong style="color:mediumseagreen;">Coherence/Quality: 4/5</strong>');
                                }
                                else if(value == 3) {
                                    $('#coherenceHelp').text("I can see why this continued from the input, and it's readable, but there are problems that can't be ignored.");
                                    $('#coherencelabel').html('<strong>Coherence/Quality: 3/5</strong>');
                                }
                                else if(value == 2) {
                                    $('#coherenceHelp').text("Some parts of the completion might make sense given the input, but it's unnatural, illogical, or quite hard to read.");
                                    $('#coherencelabel').html('<strong style="color:lightcoral">Coherence/Quality: 2/5</strong>');
                                }
                                else if(value == 1) {
                                    $('#coherenceHelp').text("The completion completely ignores or contradicts the input, and/or there are severe errors in grammaticality or fluency.");
                                    $('#coherencelabel').html('<strong style="color:red">Coherence/Quality: 1/5</strong>');
                                }
                            });
                        
                            $('#sentiment').on('input', function() {
                                var value = $(this).val()
                                if(value == 5) {
                                    $('#sentimentHelp').text(
                                        "The completion is glowingly positive.");
                                    $('#sentimentlabel').html('<strong style="color:green;">Sentiment: 5/5</strong>');
                                }
                                else if(value == 4) {
                                    $('#sentimentHelp').text("The completion is mostly positive, but there are some imperfections mentioned.");
                                    $('#sentimentlabel').html('<strong style="color:mediumseagreen;">Sentiment: 4/5</strong>');
                                }
                                else if(value == 3) {
                                    $('#sentimentHelp').text("The completion either doesn't represent a positive/negative opinion, or it contains both very positive and very negative aspects.");
                                    $('#sentimentlabel').html('<strong>Sentiment: 3/5</strong>');
                                }
                                else if(value == 2) {
                                    $('#sentimentHelp').text("Most of what's expressed here is very negative.");
                                    $('#sentimentlabel').html('<strong style="color:lightcoral">Sentiment: 2/5</strong>');
                                }
                                else if(value == 1) {
                                    $('#sentimentHelp').text("The completion offers a strongly negative opinion.");
                                    $('#sentimentlabel').html('<strong style="color:red">Sentiment: 1/5</strong>');
                                }
                            });
                        
                            
                        });
  ]]>
  </script>
</body>
</html>
